<template>
	<view>
		<view class="box">
			<view v-for="item in myList" :key="item.id" class="user_info">
				<view class="title">
					<view class="title_img">
						<img :src="item.header_Img" alt="">
					</view>
				</view>
				<view class="name">
					<p>{{item.userName}}</p>
				</view>
				<view class="label">
					<p>{{item.label}}</p>
				</view>
				<view class="info_num">
					<view @click="toguanzhu" class="guanzhu"><i class="iconfont icon-wodeguanzhu"></i>关注{{guanzhu.length}}</view><span>|</span>
					<view @click="tofensi" class="fensi"><i class="iconfont icon-renqun"></i>粉丝{{item.fensi}}</view>
				</view>
			</view>
			<view style="width: 100%;">
				<ul class="tab">
					<li @click='tab(index)' :class="current == index ? 'tab_nav' :'' " v-for="(item,index) in list"
						:key="index">
						<span>{{item}}</span>
					</li>
				</ul>
			</view>
			<view style="width: 100%; margin-top: 10px;">
				<list-com :data="dataList"></list-com>
			</view>
		</view>
	</view>
</template>

<script>
	import Issue from "../../components/issue/issue.vue";
	import ListCom from "../../components/ListCom/ListCom.vue";
	import "../../public/icon/iconfont.css";
	import {
		GetMy,
		GetEclipse
	} from "@/api/index.js"
	export default {
		components: {
			Issue,
			ListCom
		},
		data() {
			return {
				myList: [],
				list: ['收藏', '作品', '点赞'],
				current: 0,
				dataList:[],
				guanzhu:[]
			};
		},
		mounted() {
			this.getData();
			this.getLike();
			this.getGuan()
		},
		methods: {
			getData() {
				GetMy().then(res => {
					console.log(res);
					if (res.code == 200) {
						this.myList = res.data
					}

				}).catch(err => {
					console.log(err);
				})
			},
			getLike(){
				GetEclipse().then(res=>{
					console.log(res);
					if(res.code == 200){
						this.dataList = res.data.filter(item => item.status == 1)
						console.log(this.dataList);
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			getGuan(){
				GetEclipse().then(res=>{
					console.log(res);
					if(res.code == 200){
						this.guanzhu = res.data.filter(item => item.concern == 1)
						console.log(this.guanzhu);
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			toguanzhu(){
				let userName = this.myList[0].userName
				uni.navigateTo({
					url:`/pages/my/guanzhu/guanzhu?name=${userName}`,
				})
			},
			tofensi(){
				let userName = this.myList[0].userName
				uni.navigateTo({
					url:`/pages/my/fensi/fensi?name=${userName}`,
				})
			},
			tab(index) {
				this.current = index
				console.log(index);
				if (index == 0) {
					this.getLike()
				}
				if (index == 1) {
					this.dataList = []
				}
				if (index == 2) {
					this.getLike()
				}
				// 点击哪个 请求那里的数据
				// ajax => res ==>dataList
			}
		},
		onShow() {
			uni.$emit("page", {
				show: false,
			});
		},
	};
</script>

<style scoped>
	@import url(./mycss/mycss.css);
</style>